<!DOCTYPE html>
<html>
  <head> 
		<meta charset="utf-8">
    <title>Dijit Tree with Checkboxes and custom Icons</title>     
     <style type="text/css">
      @import "../../dijit/themes/claro/claro.css";
      @import "../../dijit/themes/claro/document.css";
      @import "../../dijit/tests/css/dijitTests.css";
      @import "../themes/claro/claro.css";
      @import "../icons/networkIcons.css";
    </style>

    <script type="text/javascript">
      var dojoConfig = {
            async: true,
            parseOnLoad: true,
            isDebug: false,
            baseUrl: "../../",
            locale: 'en-us',
            packages: [
              { name: "dojo",  location: "dojo" },
              { name: "dijit", location: "dijit" },
              { name: "cbtree",location: "cbtree" }
            ]
      };
    </script>

    <script type="text/javascript" src="../../dojo/dojo.js"></script> 
    <script type="text/javascript">
      require([
        "dojo/data/ItemFileWriteStore",
				"dojo/ready",
        "cbtree/Tree",                    // Checkbox Tree
        "cbtree/TreeStyling",             // Tree styling extensions
        "cbtree/models/ForestStoreModel"  // Forest Store Model
        ], function( ItemFileWriteStore, ready, Tree, TreeStyling, ForestStoreModel ) {

					var store = new ItemFileWriteStore( { url: "../datastore/Network-1.7.json" });
					var model = new ForestStoreModel( {
									store: store,
									query: {type: 'computer'},
									rootLabel: 'The Network',
									checkedAll:  true,
									checkedRoot: true,
									checkedState: true,
									checkedStrict: true
									}); 

					ready(function() {
						var tree = new Tree( {
										model: model,
										id: "MenuTree",
										checkboxMultiState: true,
										icon: { iconClass: "networkIcon", indent: true },
										branchIcons: true,
										nodeIcons: true
										}, "CheckboxTree" );
						tree.startup();
					});
        });
    </script>
  </head>
    
  <body class="claro">
    <h1>Dijit Tree with Checkboxes and Custom Icons</h1>
    <div id="CheckboxTree">  
    </div>
  </body> 
</html>